<template>
	<view class="invite-content" style="background-color:rgb(253,118,33);padding-bottom: 2rem;">
		<div class="xsm-share-top-bg">
			<img src="http://recommender.starsky.fun/tpl/Public/xsm/img/share_top_bg.png" style="width: 100%;">
			<div class="xsm-share-top-yaoqingma" style="margin-top: -70px;">
				<p style="font-size: 18px;line-height: 2.5rem;text-align: center;font-weight: 600;color: #fff;">邀请码 :
					71238</p>
			</div>
		</div>
		<div>
			<img src="http://recommender.starsky.fun/tpl/Public/xsm/img/invite_button.png"
				style="width: 90%;padding-left:5%;padding-right: 5%;" @click="openPopup">
		</div>
		<div
			style="display: flex;height: 20px;line-height: 20px;justify-content: center;color: white;background-color: rgb(253,118,33);">
			<img src="http://recommender.starsky.fun/tpl/Public/xsm/img/invite_attention.png">
			<p>注意事项</p>
			<img src="http://recommender.starsky.fun/tpl/Public/xsm/img/invite_attention.png">
		</div>
		<div style="
			width: 92%;
			padding: 1rem;
			box-sizing: border-box;
			background: #fa4f3b;
			border-radius: 0.5rem;
			margin: 1rem 4% 2rem;
			color: white;font-size: 14px;
			padding-bottom: 2rem;
			margin-bottom: 3.25rem;"
		>
			<p>凡是存在以下违规行为的用户，种草客有权扣除其作弊奖励，行为严重者将做封号处理，请您正常使用平台分享。</p>
			<br>
			<p>同一终端设备注册，绑定同一支付账号均视为同一账户，无法获得奖励。</p>
			<br>
			<p>通过不正当手段（包括但不限于侵犯第三人合法权益，作弊，扰乱系统，实施网络攻击，批量注册，用模拟器注册，以及各种形式诱导收徒） 种草客有权终结追回奖励，必要时追究法律责任。</p>
			<br>
			<p>通过不正当手段（包括但不限于侵犯第三人合法权益，作弊，扰乱系统，实施网络攻击，批量注册，用模拟器注册，以及各种形式诱导收徒） 种草客有权终结追回奖励，必要时追究法律责任。</p>
			<br>
			<p>提现奖励仅限用户余额提现，所有收益均发放到用户余额。</p>
			<br>
			<p>本次活动最终解释权归"种草客"所有。</p>
		</div>
		<tab-bar />
		<view v-if='popup' class="popup" catchtouchmove="true">
			<view class="popup-content">
				<div class="image-box">
					<image src="http://recommender.starsky.fun/Upload/qrcode/share_71242.png" mode='widthFix'></image>
					<p>长按保存图片</p>
				</div>
				<button type="default" @click='popup = false'>取消</button>
			</view>
		</view>
	</view>
</template>

<script setup>
	import TabBar from '../../components/tab-bar.vue'
	import {ref} from 'vue'
import { onBeforeMount } from 'vue';
	const popup = ref(false)
  onBeforeMount(()=>{
    uni.showLoading({
    	title: '加载中',
      mask: true
    });
     
    setTimeout(function () {
    	uni.hideLoading();
    }, 500);
  })
	const openPopup = () => {
		popup.value = true
	}
	const moveHandle = () =>{}
</script>

<style lang="scss">
.popup-content {
	z-index: 1000;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.4);
	text-align: center;
	.image-box{
		width: 680rpx;
		margin: 50rpx auto 20rpx;
		position: relative;
		image {
			width: 680rpx;
			border-radius: 0.5rem;
			overflow: hidden;
		}
		p {
			position: absolute;
			top: 0;
			left: 0;
			width: 8rem;
			height: 2.5rem;
			background-color: #faca2a;
			text-align: center;
			font-size: 14px;
			color: #fff;
			line-height: 2.5rem;
			border-radius: 0.5rem 0 0.5rem 0;
		}
	}
	button {
		width: 680rpx;
		height: 3.5rem;
		background: #fff;
		line-height: 3.5rem;
		font-size: 16px;
	}
}
</style>